// 引入拖拽js
import { startDrag } from './index.js';
import store from "../store"

/**
 * 为el-dialog弹框增加拖拽功能
 * @param {*} el 指定dom
 * @param {*} binding 绑定对象
 * desc   只要用到了el-dialog的组件，都可以通过增加v-draggable属性变为可拖拽的弹框
 */
const draggable = (el, binding) => {
  // 绑定拖拽事件 [绑定拖拽触发元素为弹框头部、拖拽移动元素为整个弹框]
  startDrag(el.querySelector('.el-dialog__header'), el.querySelector('.el-dialog'), binding.value);
};

const permission = (el, binding, vnode) => {
  const { value } = binding // add/edit/delete
  const permissionList = store.getters.buttonList  // store.getters.
  if (permissionList.indexOf(value) === -1) {
    el.style.display = "none"
    // el.parentNode.removeChild(el); // 搭配inserted
  }
}


const directives = {
  draggable,
  permission
};
// 这种写法可以批量注册指令
export default {
  install(Vue) {
    Object.keys(directives).forEach((key) => {
      Vue.directive(key, directives[key]);
    });
  }
};
